/**
 * Created by yr on 2016/10/9.
 */
var renderer;
var controls;
var width;
var height;
var raycasterMouse;
var mouse;
var game;
function initThree() {
    width=window.innerWidth;
    height=window.innerHeight;
    renderer = new THREE.WebGLRenderer({
        antialias : true,
        alpha:true
    });
    renderer.setSize(width, height);

    document.getElementById('canvas-three').appendChild(renderer.domElement);
    renderer.setClearColor(0x0, 0);
    renderer.domElement.style.position='absolute';

}

var camera;
function initCamera() {
    camera = new THREE.PerspectiveCamera(85, width / height, 1, 10000);
    camera.position.x = 0;
    camera.position.y = 0;
    camera.position.z = 550;
    camera.up.x = 0;
    camera.up.y = 1;
    camera.up.z = 0;
    camera.lookAt({
        x : 0,
        y : 0,
        z : 0
    });


}

var scene;
function initScene() {
    scene = new THREE.Scene();
}

var light;
function initLight() {
    light = new THREE.AmbientLight(0xFF0000);
    light.position.set(100, 100, 200);
    scene.add(light);

    light = new THREE.PointLight(0x00FF00);
    light.position.set(0, 0,300);
    scene.add(light);
}

var arr_mesh=new Array();
var arr_group=new Array();
var arr_loader=[];
var bool_clicked;
function initObject() {
    var arr_url=[2,2,2,2,0,2,2,2,2,2,2,1,2,2,2,2,2,3,5,5,5,5,4,5,5,5,5,5,6,5,5,5,5,7,8,8,8,8,8,9,8,8,8,8,10,11,11,11,11,11,12,5,5,5,5,5,13,2,2,2,2,2,14];
    var manager = new THREE.LoadingManager();
    manager.onProgress = function ( item, loaded, total ) {

        window.loadingUI.setProgress(loaded,total);
        console.log( item, loaded, total );
        if(loaded == total)
        {
            for(var i=0;i<arr_url.length;i++)
            {
                 var _this = this;
                 var geo_dot = new THREE.PlaneGeometry(740, 1136, 1, 1);
                 var mat_dot = new THREE.MeshBasicMaterial();
                 mat_dot.smooth=true;
                 mat_dot.side = THREE.DoubleSide;
                 mat_dot.map = arr_loader[arr_url[i]];
                 mat_dot.transparent = true;
                 var mesh_dot = new THREE.Mesh(geo_dot, mat_dot);
                 mesh_dot.position.x = 740 / 2;
                 arr_mesh.push(mesh_dot);
                 geo_dot.scale(-1, 1, 1);
                 geo_dot.name = 'geo' + i.toString();

                 var gp = new THREE.Group();
                 gp.add(mesh_dot);
                 // gp.renderOrder=arr_url.length-i
                 // gp.renderOrder=i;
                 mesh_dot.renderOrder=arr_url.length-i;
                // mesh_dot.renderOrder=i;
                 //

                 scene.add(gp);
                 gp.rotation.y = (15*arr_url.length-180-15*i) * Math.PI / 180;
                 arr_group.push(gp);

                 scene.position.x = 390;
                 scene.position.y = 40;
            }
            // scene.add(arr_group[arr_group.length-1]);
        }
    };

    for(var j=17;j<32;j++)
    {
        arr_loader[j-17]=new THREE.TextureLoader(manager).load('three_resource/2-'+j.toString()+'.png')
    }
    // for(var i=0;i<arr_url.length;i++)
    // {
    //     var _this=this;
    //     var geo_dot=new THREE.PlaneGeometry(740,1136,1,1);
    //     var mat_dot = new THREE.MeshBasicMaterial();
    //     mat_dot.side=THREE.DoubleSide;
    //     mat_dot.map=new THREE.TextureLoader().load('three_resource/'+arr_url[i]+'.png');
    //     mat_dot.transparent=true;
    //     var mesh_dot = new THREE.Mesh( geo_dot,mat_dot);
    //     mesh_dot.position.x=740/2;
    //     mesh_dot.renderOrder=2;
    //     geo_dot.scale(-1,1,1);
    //     geo_dot.name= 'geo'+i.toString();
    //     scene.add(mesh_dot);
    //
    //     var gp=new THREE.Group();
    //     gp.add(mesh_dot);
    //     gp.renderOrder=i;
    //     //
    //     scene.add(gp);
    //     gp.rotation.y=-i*36;
    //     arr_group.push(gp);
    //
    //     scene.position.x=400;
    //
    //
    // }
}

function threeStart() {
    setTimeout(function()
    {
        initThree();
        initCamera();
        initScene();
        initObject();
        // addListener(true);
        animation();
        window.addEventListener( 'resize', onWindowResize, false );
    },0);
}

function addListener(bool)
{
    if(bool)
    {
        bool_clicked=false;
        document.getElementById('canvas-three').addEventListener('touchstart',this.touchHandler,this);
        document.getElementById('canvas-three').addEventListener('touchend',this.touchHandler,this);
        document.getElementById('canvas-three').addEventListener('touchmove', this.touchHandler, this);
        document.getElementById('canvas-three').addEventListener('mousedown',this.mouseHandler,this);
        document.getElementById('canvas-three').addEventListener('mousemove', this.mouseHandler, this);
        document.getElementById('canvas-three').addEventListener('mouseup',this.mouseHandler,this);
       // document.getElementById('img_music').addEventListener('mousedown',this.m_musicStart,this);
       // document.getElementById('img_music').addEventListener('touchstart',this.t_musicStart,this);
    }
    else
    {
        document.getElementById('canvas-three').removeEventListener('touchstart',this.touchHandler,this);
        document.getElementById('canvas-three').removeEventListener('touchend',this.touchHandler,this);
        document.getElementById('canvas-three').removeEventListener('touchmove', this.touchHandler, this);
        document.getElementById('canvas-three').removeEventListener('mousedown',this.mouseHandler,this);
        document.getElementById('canvas-three').removeEventListener('mousemove', this.mouseHandler, this);
        document.getElementById('canvas-three').removeEventListener('mouseup',this.mouseHandler,this);
       // document.getElementById('img_music').removeEventListener('mousedown',this.m_musicStart,this);
        //document.getElementById('img_music').removeEventListener('touchstart',this.t_musicStart,this);
        
    }
}

function onWindowResize() {

    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();

    renderer.setSize( window.innerWidth, window.innerHeight );

}
var bool_in;
var bool_start;
function In()
{
    bool_in=true;
    for (var i=0;i<arr_group.length;i++)
    {
        arr_group[i].rotation.y+=speed;

        if(arr_group[i].rotation.y<-300* Math.PI / 180)
        {

        }
        else if(arr_group[i].rotation.y>-90* Math.PI / 180)
        {

        }
        else
        {

        }
    }
}

function animation(time)
{
    if(arr_group&&arr_group[0]&&arr_group[arr_group.length-1])
    {
        console.log(arr_group[0].rotation.y);

        if((arr_group[0].rotation.y<=-180*Math.PI/180)&&speed<0)
        {
            speed=0;
            arr_group[0].rotation.y=-180*Math.PI/180;
            if(!bool_start)
            {
                bool_start=true;
                addListener(true);
            }
        }
        else if((arr_group[arr_group.length-1].rotation.y>=-180*Math.PI/180)&&speed>0)
        {
            speed=0;
            arr_group[arr_group.length-1].rotation.y=-180*Math.PI/180;
        }

        if((arr_group[0].rotation.y>=-170*Math.PI/180)&&document.getElementById('img_info').style.opacity=='1'&&speed>=0)
        {

            new TWEEN.Tween({opacity:1})
                .to({opacity:0},400)
                .easing(TWEEN.Easing.Cubic.Out)
                .onUpdate(function(){
                    document.getElementById("img_info").style.opacity=this.opacity;
                })
                .start();
        }
    }

    for (var i=0;i<arr_group.length;i++)
    {
        if(bool_in)
        {
            arr_group[i].rotation.y+=speed;

            if(arr_group[i].rotation.y<-300* Math.PI / 180)
            {
                scene.remove(arr_group[i]);
            }
            else if(arr_group[i].rotation.y>-90* Math.PI / 180)
            {

                scene.remove(arr_group[i]);
            }
            else
            {
                arr_mesh[i].material.opacity = 0.5+((arr_group[i].rotation.y/Math.PI*180)+300)/120;
                scene.add(arr_group[i]);
            }
        }
    }



    TWEEN.update(time );
    renderer.render(scene, camera);
    requestAnimationFrame(animation);
}
var tweenZoom;
var myScale=1;
var c_pt={x:0,y:0};
var c_Intersect;
var bool_up;
var bool_move;
var ob={x:0};
var targetX=10;
var startX;
var tw;
var arr_startRot=[];
var arr_tween=[];

var speed=-0.3;
var speedStart=0;
var totalRotate=0;

function mouseHandler(e) {
    event.preventDefault();
    if (e.type == 'mousedown') {
        if(!bool_music)
       {
           console.log('sssssssssssssssssss')
           bool_music=true;
           window.loadingUI.playMusic();
       }
        bool_move=true;
        speedStart=speed;
        startX=event.clientX;
    }
    else if (e.type == 'mouseup') {
        bool_move=false;
    }
    else if(e.type=='mousemove')
    {
        if(bool_move)
        {
            speed=speedStart+(event.clientX-startX)*0.0005;
            if(speed<-0.015)
            {
                speed=-0.015;
            }
            else if(speed>0.015)
            {
                speed=0.015;
            }
        }
    }
}
var bool_music=false;
function touchHandler(event)
{
    event.preventDefault();
   if(event.type=='touchstart')
   {
       if(!bool_music)
       {
           bool_music=true;
           window.loadingUI.playMusic();
       }
       bool_move=true;
       speedStart=speed;
       startX=event.touches[0].pageX;
   }
   else if (event.type == 'touchend') {
       bool_move=false;
   }
   else if(event.type=='touchmove')
   {
       if(bool_move) {

           speed = speedStart + (event.touches[0].pageX - startX) * 0.0005;
           if (speed < -0.02) {
               speed = -0.02;
           }

           else if (speed > 0.02) {
               speed = 0.02;
           }
       }
   }
}

function m_musicStart()
{
     event.preventDefault();
    // console.log(document.getElementById('img_music').style.opacity)
    // if(document.getElementById('img_music').style.opacity=='1')
    // {
    //     document.getElementById('img_music').style.opacity=0.5;
    //      window.loadingUI.playMusic();
    // }
    // else
    // {
    //     document.getElementById('img_music').style.opacity=1;
    //      window.loadingUI.stopMusic();
    // }
   
}
function t_musicStart()
{
     event.preventDefault();
    // console.log(document.getElementById('img_music').style.opacity)
    // if(document.getElementById('img_music').style.opacity=='1')
    // {
    //     document.getElementById('img_music').style.opacity=0.5;
    //      window.loadingUI.playMusic();
    // }
    // else
    // {
    //     document.getElementById('img_music').style.opacity=1;
    //      window.loadingUI.stopMusic();
    // }
   
}